
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <script src="iconfont.js"></script>

    <style type="text/css">
        .icon {
          /* 通过设置 font-size 来改变图标大小 */
          width: 1em; height: 1em;
          /* 图标和文字相邻时，垂直对齐 */
          vertical-align: -0.15em;
          /* 通过设置 color 来改变 SVG 的颜色/fill */
          fill: currentColor;
          /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
             normalize.css 中也包含这行 */
          overflow: hidden;
        }

    </style>
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-baiwenbaida"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_百问百答</div>
                    <div class="fontclass">#icon-baiwenbaida</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-biaoqingshiwang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_表情失望</div>
                    <div class="fontclass">#icon-biaoqingshiwang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-bohuiweikong"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_驳回为空</div>
                    <div class="fontclass">#icon-bohuiweikong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dianhua"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_电话</div>
                    <div class="fontclass">#icon-dianhua</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dingwei"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_定位</div>
                    <div class="fontclass">#icon-dingwei</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ershoufang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_二手房</div>
                    <div class="fontclass">#icon-ershoufang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ershoufangchengjiao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_二手房成交</div>
                    <div class="fontclass">#icon-ershoufangchengjiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fabuershoufang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_发布二手房</div>
                    <div class="fontclass">#icon-fabuershoufang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fabuzufangn"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_发布租房n   </div>
                    <div class="fontclass">#icon-fabuzufangn</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-faxian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_发现</div>
                    <div class="fontclass">#icon-faxian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fanhui"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_返回</div>
                    <div class="fontclass">#icon-fanhui</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fanhuidingbu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_返回顶部</div>
                    <div class="fontclass">#icon-fanhuidingbu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gengduo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_更多</div>
                    <div class="fontclass">#icon-gengduo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guanbi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_关闭</div>
                    <div class="fontclass">#icon-guanbi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guoneixinpan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_国内新盘</div>
                    <div class="fontclass">#icon-guoneixinpan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-haiwaidichan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_海外地产</div>
                    <div class="fontclass">#icon-haiwaidichan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-haoanjie"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_好按揭</div>
                    <div class="fontclass">#icon-haoanjie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-haofangtuo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_好房拓</div>
                    <div class="fontclass">#icon-haofangtuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-hui"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_惠</div>
                    <div class="fontclass">#icon-hui</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jibenxinxi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_基本信息</div>
                    <div class="fontclass">#icon-jibenxinxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jisuanqi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_计算器</div>
                    <div class="fontclass">#icon-jisuanqi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jiazai"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_加载</div>
                    <div class="fontclass">#icon-jiazai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-kanfangtuan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_看房团</div>
                    <div class="fontclass">#icon-kanfangtuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-kehu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_客户</div>
                    <div class="fontclass">#icon-kehu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-mima"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_密码</div>
                    <div class="fontclass">#icon-mima</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-miaoshufangyuan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_描述房源</div>
                    <div class="fontclass">#icon-miaoshufangyuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-pinpaidichan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_品牌地产</div>
                    <div class="fontclass">#icon-pinpaidichan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qiangershoufangshikan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_抢二手房实勘</div>
                    <div class="fontclass">#icon-qiangershoufangshikan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qiangzufangshikan57"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_抢租房实勘-57</div>
                    <div class="fontclass">#icon-qiangzufangshikan57</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qiangzufangshikan59"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_抢租房实勘-59</div>
                    <div class="fontclass">#icon-qiangzufangshikan59</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qiugouxinxi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_求购信息</div>
                    <div class="fontclass">#icon-qiugouxinxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shaixuan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_筛选</div>
                    <div class="fontclass">#icon-shaixuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shaixuanzhedie"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_筛选折叠</div>
                    <div class="fontclass">#icon-shaixuanzhedie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shangchuantupian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_上传图片</div>
                    <div class="fontclass">#icon-shangchuantupian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shezhi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_设置</div>
                    <div class="fontclass">#icon-shezhi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shenqingershoufangshikan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_申请二手房实勘</div>
                    <div class="fontclass">#icon-shenqingershoufangshikan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shikanweikong"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_实勘为空</div>
                    <div class="fontclass">#icon-shikanweikong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shoucang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_收藏</div>
                    <div class="fontclass">#icon-shoucang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shoucangweikong"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_收藏为空</div>
                    <div class="fontclass">#icon-shoucangweikong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shuaxin"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_刷新</div>
                    <div class="fontclass">#icon-shuaxin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-sousuo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_搜索</div>
                    <div class="fontclass">#icon-sousuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tishi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_提示</div>
                    <div class="fontclass">#icon-tishi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tianjia"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_添加</div>
                    <div class="fontclass">#icon-tianjia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tuan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_团</div>
                    <div class="fontclass">#icon-tuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wancheng"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_完成</div>
                    <div class="fontclass">#icon-wancheng</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我</div>
                    <div class="fontclass">#icon-wo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodechengjiao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的成交</div>
                    <div class="fontclass">#icon-wodechengjiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodeershoufang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的二手房</div>
                    <div class="fontclass">#icon-wodeershoufang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodekanfangtuan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的看房团</div>
                    <div class="fontclass">#icon-wodekanfangtuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodepeixun"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的培训</div>
                    <div class="fontclass">#icon-wodepeixun</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodeqiugou"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的求购</div>
                    <div class="fontclass">#icon-wodeqiugou</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodezufang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的租房</div>
                    <div class="fontclass">#icon-wodezufang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-woqiangdaodeshikan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我抢到的实勘</div>
                    <div class="fontclass">#icon-woqiangdaodeshikan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-woshenqingdeshikan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我申请的实勘</div>
                    <div class="fontclass">#icon-woshenqingdeshikan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wotuijiandekehu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我推荐的客户</div>
                    <div class="fontclass">#icon-wotuijiandekehu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiaoxi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_消息</div>
                    <div class="fontclass">#icon-xiaoxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xin"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_新</div>
                    <div class="fontclass">#icon-xin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xinpandingyue"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_新盘订阅</div>
                    <div class="fontclass">#icon-xinpandingyue</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xuanze"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_选择右</div>
                    <div class="fontclass">#icon-xuanze</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yishoucang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_已收藏</div>
                    <div class="fontclass">#icon-yishoucang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yijianfankui"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_意见反馈</div>
                    <div class="fontclass">#icon-yijianfankui</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yong"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_佣</div>
                    <div class="fontclass">#icon-yong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yonghuming"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_用户名</div>
                    <div class="fontclass">#icon-yonghuming</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yuyin"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_语音</div>
                    <div class="fontclass">#icon-yuyin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhedie"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_折叠</div>
                    <div class="fontclass">#icon-zhedie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zufangchengjiao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_租房成交</div>
                    <div class="fontclass">#icon-zufangchengjiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-baobeikehu2"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 报备客户</div>
                    <div class="fontclass">#icon-baobeikehu2</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-biaotilansanjiao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_标题栏三角</div>
                    <div class="fontclass">#icon-biaotilansanjiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ershoufang72"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_二手房标</div>
                    <div class="fontclass">#icon-ershoufang72</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-haiwai"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_海外</div>
                    <div class="fontclass">#icon-haiwai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yuyue"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_预约</div>
                    <div class="fontclass">#icon-yuyue</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-baobeikehu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_报备客户</div>
                    <div class="fontclass">#icon-baobeikehu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yixiajia"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_已下架</div>
                    <div class="fontclass">#icon-yixiajia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-logo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_logo</div>
                    <div class="fontclass">#icon-logo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodehaoanjie"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的好按揭</div>
                    <div class="fontclass">#icon-wodehaoanjie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xuanzezuo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_选择左</div>
                    <div class="fontclass">#icon-xuanzezuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-guanbi80"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_关闭-80</div>
                    <div class="fontclass">#icon-guanbi80</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-pai"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_派</div>
                    <div class="fontclass">#icon-pai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wancheng82"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_完成-82</div>
                    <div class="fontclass">#icon-wancheng82</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodeershoufangshikan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的二手房实勘</div>
                    <div class="fontclass">#icon-wodeershoufangshikan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-wodezufangshikan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的租房实勘</div>
                    <div class="fontclass">#icon-wodezufangshikan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiayige"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_下一个</div>
                    <div class="fontclass">#icon-xiayige</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dianhuaanniu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_电话按钮</div>
                    <div class="fontclass">#icon-dianhuaanniu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qiandao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_签到</div>
                    <div class="fontclass">#icon-qiandao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qiandaochenggong"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_签到成功</div>
                    <div class="fontclass">#icon-qiandaochenggong</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-haofangtuo400iconfontwangluocuowu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_网络错误</div>
                    <div class="fontclass">#icon-haofangtuo400iconfontwangluocuowu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xinxishenhe"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_信息审核</div>
                    <div class="fontclass">#icon-xinxishenhe</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-woderenwu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_我的任务</div>
                    <div class="fontclass">#icon-woderenwu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-huxing"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_户型</div>
                    <div class="fontclass">#icon-huxing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jin"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_金</div>
                    <div class="fontclass">#icon-jin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jungongshijian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_竣工时间</div>
                    <div class="fontclass">#icon-jungongshijian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-louceng"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_楼层</div>
                    <div class="fontclass">#icon-louceng</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-mianji"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_面积</div>
                    <div class="fontclass">#icon-mianji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shoujia"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_售价</div>
                    <div class="fontclass">#icon-shoujia</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhuzhaileixing"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_住宅类型</div>
                    <div class="fontclass">#icon-zhuzhaileixing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhuangxiu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_装修</div>
                    <div class="fontclass">#icon-zhuangxiu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhaoxiang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_朝向</div>
                    <div class="fontclass">#icon-zhaoxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhedieguanbi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_折叠关闭</div>
                    <div class="fontclass">#icon-zhedieguanbi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-duanxin"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_短信</div>
                    <div class="fontclass">#icon-duanxin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-kaobeilianjie"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_拷贝链接</div>
                    <div class="fontclass">#icon-kaobeilianjie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-pengyouquan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_朋友圈</div>
                    <div class="fontclass">#icon-pengyouquan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shaixuanguanbi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_筛选关闭</div>
                    <div class="fontclass">#icon-shaixuanguanbi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shaixuanzhedieguanbi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_筛选折叠关闭</div>
                    <div class="fontclass">#icon-shaixuanzhedieguanbi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weibo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_微博</div>
                    <div class="fontclass">#icon-weibo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weixin"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_微信</div>
                    <div class="fontclass">#icon-weixin</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-qqkongjian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_QQ空间</div>
                    <div class="fontclass">#icon-qqkongjian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-jingjiren"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_经纪人</div>
                    <div class="fontclass">#icon-jingjiren</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-tousu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_投诉</div>
                    <div class="fontclass">#icon-tousu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-baocun"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_保存</div>
                    <div class="fontclass">#icon-baocun</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fenxiang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_分享</div>
                    <div class="fontclass">#icon-fenxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shanchu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont_删除</div>
                    <div class="fontclass">#icon-shanchu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xianshi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_显示</div>
                    <div class="fontclass">#icon-xianshi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yincang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_隐藏</div>
                    <div class="fontclass">#icon-yincang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ditie"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_地铁</div>
                    <div class="fontclass">#icon-ditie</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ditu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_地图</div>
                    <div class="fontclass">#icon-ditu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gouwu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_购物</div>
                    <div class="fontclass">#icon-gouwu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-meishi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_美食</div>
                    <div class="fontclass">#icon-meishi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiaoqu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_小区</div>
                    <div class="fontclass">#icon-xiaoqu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiaoqumingcheng"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_小区名称</div>
                    <div class="fontclass">#icon-xiaoqumingcheng</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xuexiao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_学校</div>
                    <div class="fontclass">#icon-xuexiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yiyuan"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_医院</div>
                    <div class="fontclass">#icon-yiyuan</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yinxing"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_银行</div>
                    <div class="fontclass">#icon-yinxing</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-ruzhushijian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_入住时间</div>
                    <div class="fontclass">#icon-ruzhushijian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gengduoweidian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_更多未点</div>
                    <div class="fontclass">#icon-gengduoweidian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-gengduoyidian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_更多已点</div>
                    <div class="fontclass">#icon-gengduoyidian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-bingxiang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_冰箱</div>
                    <div class="fontclass">#icon-bingxiang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-chuang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_床</div>
                    <div class="fontclass">#icon-chuang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dayigui"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_大衣柜</div>
                    <div class="fontclass">#icon-dayigui</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dianshi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_电视</div>
                    <div class="fontclass">#icon-dianshi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dianti"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_电梯</div>
                    <div class="fontclass">#icon-dianti</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-kongdiao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_空调</div>
                    <div class="fontclass">#icon-kongdiao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-kuandai"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_宽带</div>
                    <div class="fontclass">#icon-kuandai</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-meiqizao"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_煤气灶</div>
                    <div class="fontclass">#icon-meiqizao</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-reshuiqi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_热水器</div>
                    <div class="fontclass">#icon-reshuiqi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-haofangtuo400iconfont2shafa"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_沙发</div>
                    <div class="fontclass">#icon-haofangtuo400iconfont2shafa</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-weibolu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_微波炉</div>
                    <div class="fontclass">#icon-weibolu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xiyiji"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_洗衣机</div>
                    <div class="fontclass">#icon-xiyiji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-chuzufangshi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_出租方式</div>
                    <div class="fontclass">#icon-chuzufangshi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fabushijian"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_发布时间</div>
                    <div class="fontclass">#icon-fabushijian</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhinengmensuo"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_智能门锁</div>
                    <div class="fontclass">#icon-zhinengmensuo</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-kehuguanli"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_客户管理</div>
                    <div class="fontclass">#icon-kehuguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dianpushoucang"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_店铺收藏</div>
                    <div class="fontclass">#icon-dianpushoucang</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-dianpu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_店铺</div>
                    <div class="fontclass">#icon-dianpu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-fangyuanguanli"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_房源管理</div>
                    <div class="fontclass">#icon-fangyuanguanli</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-zhiding"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_置顶</div>
                    <div class="fontclass">#icon-zhiding</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yingxiaogongju"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_营销工具</div>
                    <div class="fontclass">#icon-yingxiaogongju</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-shujutongji"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_数据统计</div>
                    <div class="fontclass">#icon-shujutongji</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-pipeikehu"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_匹配客户</div>
                    <div class="fontclass">#icon-pipeikehu</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-IMxiaoxi"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_IM消息</div>
                    <div class="fontclass">#icon-IMxiaoxi</div>
                </li>
            
                <li>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-meishi-copy"></use>
                    </svg>
                    <div class="name">好房拓 4.0.0 iconfont 2_美食</div>
                    <div class="fontclass">#icon-meishi-copy</div>
                </li>
            
        </ul>


        <h2 id="symbol-">symbol引用</h2>
        <hr>

        <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
        这种用法其实是做了一个svg的集合，与另外两种相比具有如下特点：</p>
        <ul>
          <li>支持多色图标了，不再受单色限制。</li>
          <li>通过一些技巧，支持像字体那样，通过<code>font-size</code>,<code>color</code>来调整样式。</li>
          <li>兼容性较差，支持 ie9+,及现代浏览器。</li>
          <li>浏览器渲染svg的性能一般，还不如png。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-symbol-">第一步：引入项目下面生成的symbol代码：</h3>
        <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;</span></code></pre>
        <h3 id="-css-">第二步：加入通用css代码（引入一次就行）：</h3>
        <pre><code class="lang-js hljs javascript">&lt;style type=<span class="hljs-string">"text/css"</span>&gt;
.icon {
   width: <span class="hljs-number">1</span>em; height: <span class="hljs-number">1</span>em;
   vertical-align: <span class="hljs-number">-0.15</span>em;
   fill: currentColor;
   overflow: hidden;
}
&lt;<span class="hljs-regexp">/style&gt;</span></code></pre>
        <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
        <pre><code class="lang-js hljs javascript">&lt;svg <span class="hljs-class"><span class="hljs-keyword">class</span></span>=<span class="hljs-string">"icon"</span> aria-hidden=<span class="hljs-string">"true"</span>&gt;<span class="xml"><span class="hljs-tag">
  &lt;<span class="hljs-name">use</span> <span class="hljs-attr">xlink:href</span>=<span class="hljs-string">"#icon-xxx"</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">use</span>&gt;</span>
</span>&lt;<span class="hljs-regexp">/svg&gt;
        </span></code></pre>
    </div>
</body>
</html>
